<template>
	<view>
		<view class="wrap">
			<view class="media" v-for="item in allArry" :key="item.id">
				<navigator :url="'../detail/detail?id='+item.id">
					<view class="media-left">
						<image :src="item.images.small" mode="widthFix" @load="imgLoad"></image>
					</view>
					<view class="media-right">
						<view class="media-title">
							<text class="m-title">{{item.title}}</text>
							<text class="average">{{item.rating.average}}分
							</text>
						</view>
						<text class="genres">{{item.genres}}</text>
						<view class="director" v-for="list in item.directors" :key="list.id">
							<text>导演：{{list.name}}</text>
						</view>
						<text>上映时间：{{item.year}}</text>
					</view>
				</navigator>
			</view>
		</view>
		<view class="no-more" v-show="noMoreShow">~没有更多了~</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				allArry: [],
				topStart: 1,
				links: null,
				noMoreShow: false
			}
		},
		onLoad(option) {
			let title = option.title;
			let link = option.links;
			this.links = link;
			// 动态改变顶部导航栏文字
			uni.setNavigationBarTitle({
				title: title
			});
			this.getAllDatas(this.links);			
		},
		methods: {
			getAllDatas: function(url){
				let _self = this;
				let start = (_self.topStart-1)*6;
				_self.$http.get(url+'?start='+start+'&count=4').then(res=>{
					_self.allArry = _self.allArry.concat(res.subjects);
					// console.log(_self.topArry)
				}).catch(res=>{
					console.log(res)
				})
			},
			onReachBottom: function(){
				let _self = this;
				setTimeout(function(){
					_self.topStart++;
					if(_self.topStart>5){
						_self.noMoreShow = true;
						return false;
					}
					_self.getAllDatas(_self.links);
				},200)
				
			}
		}
	}
</script>

<style>

</style>
